@extends('WShop::layout')
@section('content')
    @include('WShop::public.header')
    @component('WShop::public.header')
        @slot('page_title'){{$page_title}} @endslot
        @slot('btn')
            <a href="{{route('f_Wap_Account_transfer')}}" class="mui-pull-right mui-text-bai" style="margin-top: 12px;font-size: 12px;">转账管理</a>
        @endslot
    @endcomponent
    <div class="mui-content mui-scroll-wrapper" id="pullrefresh">
        <div class="mui-scroll">
                <div class="mui-zhuda" style="padding-top: 10px;">
                    <div class="mui-dingdan-list">
                        @if($list->isNotEmpty())
                            <ul class="mui-list-unstyled mui-clearfix" id="pull-load" data-currency="{{json_encode(get_currency())}}">
                                @foreach($list as $item)
                                    <li class="bg-fff">
                                        <div class="dingdan-list-header">转账时间：{{$item->created_at}}

                                        </div>
                                        <div class="flex">

                                            <div class="flex-right" style="width: 100%;">
                                                <div class="flex">
                                                    <div class="mui-ellipsis-2 mui-text-red">备注:{{$item->comment ?? ''}}</div>
                                                </div>
                                                <div>
                                                    <div style="padding-left: 10px;color: #999;">相关会员:{{$item->to_users['user_number']}}</div>
                                                    <div style="padding-left: 10px"><span style="margin-right: 50px;">转出金额:￥{{$item->out_money}}</span></div>
                                                    <div style="padding-left: 10px"><span style="margin-right: 50px;">转入金额:￥{{$item->in_money}}</span></div>
                                                    <div style="padding-left: 10px"><span style="margin-right: 50px;">手续费:￥{{$item->service_fee}}</span></div>
                                                    <div style="padding-left: 10px"><span style="margin-right: 50px;">转比:{{$item->tfrate}}</span></div>
                                                    <div style="padding-left: 10px"><span style="margin-right: 50px;">转账类型:{{get_currency()['money'.$item->out_mid]}}=>{{get_currency()['money'.$item->in_mid]}}</span></div>
                                                </div>

                                            </div>
                                        </div>
                                    </li>
                                @endforeach
                            </ul>

                        @else
                            <div style="height: 110px;"></div>
                            <div class="mui-text-center">
                                <img src="{{asset(config('mall.wap_assets1').'/images/empty.png')}}" alt="" width="200">
                                <p style="margin-top: 50px;"><a href="javascript:void(0);" style="color: #fff;border: 1px solid #8a96a2;padding: 8px 24px;border-radius: 16px;background: #8a96a2;">暂无数据</a></p>
                            </div>

                        @endif
                    </div>
                </div>

            </div>
        </div>
    </div>
    @include('WShop::public.foot_bar',['active'=>'user'])
@endsection
@push('scripts')
    <script src="{{asset(config('view.plugin').'/other/day.js')}}"></script>
    <script src="{{asset(config('view.frontend.wap_login').'/js/pull-loading.js')}}"></script>
    <script>
        pullLoading.tpl = '<li class="bg-fff">' +
            '<div class="dingdan-list-header">转账时间：{%created_at%}</div>' +
            '<div class="flex"><div class="flex-right" style="width: 100%;">{%handle_remark%}<div>' +
            '<div style="padding-left: 10px;color: #999;">相关会员：{%relate_number%}</div>' +
            '<div style="padding-left: 10px"><span style="margin-right: 50px;">转出金额:￥{%out_money%}</span></div>\n' +
            '<div style="padding-left: 10px"><span style="margin-right: 50px;">转入金额:￥{%in_money%}</span></div>\n' +
            '<div style="padding-left: 10px"><span style="margin-right: 50px;">手续费:￥{%service_fee%}</span></div>\n' +
            '<div style="padding-left: 10px"><span style="margin-right: 50px;">转比:{%tf_rate%}</span></div>\n' +
            '<div style="padding-left: 10px"><span style="margin-right: 50px;">转账类型:{%tf_type%}</span></div>\n' +
            '</div></div></div></li>';

        var Currency = $('#pull-load').data('currency');

        pullLoading.load(function (data) {
            var len = data.length;
            for (var i=0; i<len; i++){
                var dateObj = dayjs(data[i]['created_at']*1000);

                var handleRemark = '<div class="flex"><div class="mui-ellipsis-2  mui-text-red">备注:'+data[i]['comment']+'</div></div>';

                var account = data[i]['to_users']['user_number'];

                var in_mid = 'money'+data[i]['in_mid'];
                var out_mid = 'money'+data[i]['out_mid'];

                var tf_type_text = Currency[out_mid]+'=>'+Currency[in_mid];

                var itemTpl =pullLoading.tpl;

                itemTpl = itemTpl.replace('{%created_at%}',dateObj.format('YYYY-MM-DD HH:mm:ss'))
                    .replace('{%handle_remark%}',handleRemark)
                    .replace('{%relate_number%}',account)
                    .replace('{%out_money%}',[data[i]['out_money']])
                    .replace('{%in_money%}',data[i]['in_money'])
                    .replace('{%service_fee%}',data[i]['service_fee'])
                    .replace('{%tf_rate%}',data[i]['tfrate'])
                    .replace('{%tf_type%}',tf_type_text);
                $("#pull-load").append(itemTpl);
            }
        })
    </script>
@endpush